<%--
  Created by IntelliJ IDEA.
  User: 12174
  Date: 2020/4/3
  Time: 10:13
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" isELIgnored="false" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>订单详情页面</title>
    <link rel="stylesheet" href="${pageContext.request.contextPath}/css/order/order_detail.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/layui/css/layui.css">
    <script src="${pageContext.request.contextPath}/js/jquery-3.4.1.min.js"></script>
    <script src="${pageContext.request.contextPath}/layui/layui.js"></script>
</head>
<body>
<div class="body">
    <!--
                    顶部导航栏
    -->
    <div class="header">

    </div>
    <!--
                    订单详情主体
    -->
    <div class="detail_body">
        <!--
                    订单信息部分
        -->
        <div class="detail_model">
            <div class="detail_title">
                <span>订单信息</span>
            </div>
            <div class="detail_info">
                <ul>
                    <li>
                        <span class="key">订单编号：&nbsp;&nbsp;</span>
                        <span class="desc">92720191223175937037004</span>
                    </li>
                    <li>
                        <span class="key">产品名称：&nbsp;&nbsp;</span>
                        <span class="desc">三亚8天7晚自由行,亲子&情侣优选,高性价比酒店推荐 含多项赠送</span>
                    </li>
                    <li>
                        <span class="key">下单时间：&nbsp;&nbsp;</span>
                        <span class="desc">2019-12-23 17:59</span>
                    </li>
                    <li>
                        <span class="key">订单金额：&nbsp;&nbsp;</span>
                        <span class="desc">￥</span>
                        <span class="desc expect_cost">5949</span>
                    </li>
                    <li>
                        <span class="key">实付金额：&nbsp;&nbsp;</span>
                        <span class="desc">￥</span>
                        <span class="desc actual_cost">5949</span>
                    </li>
                    <!--
                                    订单状态：
                       当状态为：已结束时  显现评价的按钮
                    -->
                    <li>
                        <span class="key">订单状态：&nbsp;&nbsp;</span>
                        <span class="desc">已结束</span>
                        <a href="javascript:void(0);" class="desc evaluation">立即评价</a>
                    </li>
                </ul>
            </div>
        </div>
        <!--
                    联系人部分
        -->
        <div class="detail_model">
            <div class="detail_title">
                <span>联系人信息</span>
            </div>
            <div class="detail_info">
                <ul>
                    <li>
                        <span class="key">姓名：&nbsp;&nbsp;</span>
                        <span class="desc">徐恒波</span>
                    </li>
                    <li>
                        <span class="key">手机号：&nbsp;&nbsp;</span>
                        <span class="desc">131****8753</span>
                    </li>
                </ul>
            </div>
        </div>
        <!--
                    出行人信息部分
        -->
        <div class="detail_model">
            <div class="detail_title">
                <span>出行人信息</span>
            </div>
            <!--
                   这是一个单个的出行人信息（测试）
            -->
            <div>
                <div class="detail_traveler">
                    <p class="fare">
                        <span>旅客&nbsp;&nbsp;</span>
                        <span class="t_no">1</span>
                    </p>
                    <p class="t_type">
                        <span>(</span>
                        <span>儿童，2-12岁</span>
                        <span>)</span>
                    </p>

                </div>
                <div class="detail_info detail_t_ul">
                    <ul>
                        <li>
                            <span class="key">姓名：&nbsp;&nbsp;</span>
                            <span class="desc">徐恒波</span>
                        </li>
                        <li>
                            <span class="key">手机号：&nbsp;&nbsp;</span>
                            <span class="desc">131****8753</span>
                        </li>
                    </ul>
                </div>
                <div class="split_line"></div>
            </div>
            <div>
                <div class="detail_traveler">
                    <p class="fare">
                        <span>旅客&nbsp;&nbsp;</span>
                        <span class="t_no">2</span>
                    </p>
                    <p class="t_type">
                        <span>(</span>
                        <span>儿童，2-12岁</span>
                        <span>)</span>
                    </p>
                </div>
                <div class="detail_info detail_t_ul">
                    <ul>
                        <li>
                            <span class="key">姓名：&nbsp;&nbsp;</span>
                            <span class="desc">徐恒波</span>
                        </li>
                        <li>
                            <span class="key">手机号：&nbsp;&nbsp;</span>
                            <span class="desc">131****8753</span>
                        </li>
                    </ul>
                </div>
                <div class="split_line"></div>
            </div>
        </div>
    </div>
</div>
</body>
<script src="${pageContext.request.contextPath}/js/order/order_detail.js"></script>
</html>

